<script setup>
import { toRefs } from 'vue'
import http from '@/config/axios-config'

const props = defineProps({
  status: {
    type: Number,
    default: 0,
  },
  re: {
    type: Boolean,
    default: true
  },
  delTitle: {
    type: String,
    default: '确定要删除此记录吗？'
  },
  delButton: {
    type: String,
    default: '删除'
  },
  reTitle: {
    type: String,
    default: '确定要上架此记录吗？'
  },
  reButton: {
    type: String,
    default: '恢复'
  },
  normalStatus: {
    type: Number,
    default: 1,
  },
  dellStatus: {
    type: Number,
    default: 2,
  },
  requestPath: {
    type: [Boolean, String],
    default: false
  },
  params: {
    type: Object,
    default: () => {}
  }
})
const emits = defineEmits(['confirm', 'requestSuccess'])

let { re, status, normalStatus, dellStatus, reButton, reTitle, delButton, delTitle } = toRefs(props)

const confirmHandler = (status) => {
  if (props.requestPath) {
    http.post(props.requestPath, { ...props.params, Status: status }).then(res => {
      emits('requestSuccess', res)
    })
  } else {
    emits('confirm', status)
  }
}
</script>

<template>
  <span style="margin-left: 8px">
    <template v-if="!re">
      <link-btn
          :title="delButton" danger disabled
          v-if="(typeof status === 'boolean' && status) || status !== normalStatus"
      />
      <a-popconfirm v-else :title="delTitle" ok-text="确认" cancel-text="取消" @confirm="confirmHandler(dellStatus)">
        <link-btn :title="delButton" danger/>
      </a-popconfirm>
    </template>

    <template v-else>
      <a-popconfirm :title="delTitle" ok-text="确认" cancel-text="取消" @confirm="confirmHandler(dellStatus)"
                    v-if="status === normalStatus">
        <link-btn :title="delButton" danger/>
      </a-popconfirm>
      <a-popconfirm :title="reTitle" ok-text="确认" cancel-text="取消" @confirm="confirmHandler(normalStatus)" v-else>
        <link-btn :title="reButton"/>
      </a-popconfirm>
    </template>
  </span>
</template>
